<template>
  <div class="container">
    <el-dialog title="审核" :visible.sync="examineModalShow" width="650px" :before-close="cancelBtn">
      <div class="container_examine">
        <p>预约信息</p>
        <div class="examine">
          <base-info-form :base-list="examineList" />
        </div>
      </div>
      <div class="container_examine">
        <p>审核</p>
        <div class="examine">
          <el-form ref="ruleForm" :model="formInline" label-width="80px">
            <el-form-item label="审核结果">
              <el-radio-group v-model="formInline.result">
                <el-radio label="通过" value="0" />
                <el-radio label="驳回" value="1" />
              </el-radio-group>
            </el-form-item>
            <el-form-item v-if="formInline.result === '驳回'" label="审核意见" class="opinion">
              <el-input v-model="formInline.opinion" type="textarea" />
            </el-form-item>
          </el-form>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="cancelBtn">取消</el-button>
        <el-button size="small" type="primary" @click="saveBtn">确认</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import BaseInfoForm from './BaseInfoForm'
import { getbaseInfoList, examineInfoList } from '../api'
export default {
  components: {
    BaseInfoForm
  },
  props: ['applyId','examineModalShow'],
  data() {
    return {
      formInline: {
        result: '通过',
        opinion: ''
      },
      examineList: {},
      apply_id: '',
      userInfo: JSON.parse(sessionStorage.getItem('userInfo'))
    }
  },
  watch: {
    applyId(val) {
      this.apply_id = val
      this.getInfoList(val)
    }
  },
  created() {

  },
  methods: {
    getInfoList(applyId) {
      getbaseInfoList(applyId).then(res => {
        // console.log(res)
        this.examineList = res.data.data.info_datails
      })
    },
    saveBtn() {
      const data = {
        ryid: this.userInfo.id,
        app_id: this.apply_id,
        opinion: this.formInline.opinion,
        reviewer: this.userInfo.account,
        audit_result: this.formInline.result,
        sender_uer: this.userInfo.nickName,
        account: this.userInfo.username
      }
      examineInfoList(data).then(res => {
        console.log(res)
        if (res.data.code == 200) {
          this.$message({
            type: 'success',
            message: '审核完成'
          })
          this.formInline.opinion = ''
          // this.examineModalShow = false
          this.$emit('examineFun', true)
        }
      })
    },
    cancelBtn() {
      // this.examineModalShow = false
      this.formInline.opinion = '';
      this.$emit('examineFun', false)
    }
  }
}
</script>

<style lang="scss" scoped>
  .container {
    ::v-deep .el-dialog__headerbtn .el-dialog__close {
      color: #fff;
    }
    ::v-deep .el-dialog {
      max-height: 80vh;
      overflow: auto;
    }
    ::v-deep .el-dialog__body {
      margin-top: 25px;
    }
    ::v-deep .el-dialog__header {
      /*background: #3489ff;*/
      position: fixed;
      width: 650px;
      z-index: 99;
      /*.el-dialog__title {*/
        /*color: #ffffff;*/
      /*}*/
      .el-dialog__headerbtn {
        top: 14px !important;
        cursor: pointer;
        /*i {*/
          /*color: #ffffff;*/
        /*}*/
      }
    }
    .container_examine{
      margin-top: 20px;
      p{
        font-size: 15px;
        color: #3D4D60;
        font-weight: bold;
      }
      .examine{
        background: #F8F8F8;
        padding: 10px;
        .opinion{
          ::v-deep .el-textarea{
            margin-left: 12px;
          }
          ::v-deep .el-form-item__content{
            margin-left:0!important;
          }
        }
        ::v-deep .el-form-item__label{
          font-weight: normal;
        }
        ::v-deep .el-form-item{
          margin-bottom: 0;
        }
      }
    }
  }

</style>
